<template>
	<view class="">
		<view class="title-con">
			<view class="jiantou" @click="fanhui">
				<img src="../Home/生活图片/cxy1_16.png">
			</view>
			<view class="title">
				商品发布
			</view>
			<view class="title-right">
				<view class="wx" @click='release'>
					发布
				</view>

			</view>
		</view>
		<view class="radio">
			<p>类型</p>
			<view class="radio-in">
				<u-radio-group v-model="value" @change="radioGroupChange">
					<u-radio @change="radioChange" v-for="(item, index) in list" :key="index" :name="item.name"
						:disabled="item.disabled" active-color="#4ba6d3">
						{{item.name}}
					</u-radio>
				</u-radio-group>
			</view>
		</view>
		<view class="radio">
			<p>价格</p>
			<view class="radio-in">
				<input type="text" placeholder="请输入价格" v-model="items.price" />

			</view>
		</view>
		<view class="text">
			<input type="text" placeholder="写点商品的介绍文字吧~" v-model="items.content" />
		</view>
		<view class="fabu-img">
			<!-- <img src="./市场/cxy_26.png"> -->
			<u-upload ref="uUpload" :action="action" :auto-upload="true" @on-success="uploadSuccess"></u-upload>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						name: '二手',
						disabled: false
					},
					{
						name: '新品',
						disabled: false
					},

				],
				// u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
				value: 'orange',
				action: 'http://127.0.0.1:7001/api/updateImg',
				items:{
					pin:'',
					img1: [],
					price:'',
					content:'',
					name:'小明',
					img:'http://127.0.0.1:7001/public/cxyimg/cxy_5.png'
				}
			}

		},
		onShow() {

		},
		methods: {
			// 返回上一页
			fanhui() {
				uni.switchTab({
					url:'/pages/questions/questions'
				})
			},
			// 选中某个单选框时，由radio时触发
			radioChange(e) {
				// console.log(e);
			},
			// 选中任一radio时，由radio-group触发
			radioGroupChange(e) {
				this.items.pin= e
			},
			// 发布
			uploadSuccess(data, index, lists, name) {
				var arr= []
				lists.forEach(({response})=>{
					arr.push(`http://127.0.0.1:7001${response.data}`)
				})
				this.items.img1 = arr.join()
			},
			release(){
				this.$api.createMsg(this.items)
				uni.navigateBack({
					url:'pages/questions/questions'
				})
			}

		},
	}
</script>

<style>
	.title-con {
		width: 100%;
		height: 112upx;
		/* background-color: antiquewhite; */
		display: flex;
		justify-content: space-between;
		border-bottom: 1px solid #faab34;
	}

	.title {
		width: 33%;
		height: 100%;
		/* background-color: antiquewhite; */
		/* margin-left: 30upx; */
		line-height: 61px;
		text-align: center;
		font-size: 38upx;
		margin-left: -30upx;
		/* margin-top: 20upx; */
	}

	.jiantou {
		width: 33%;
		height: 90%;
		/* background-color: aquamarine; */
	}

	.jiantou img {
		width: 9%;
		height: 41%;
		margin-top: 24upx;
		margin-left: 20upx;
	}

	.title-right {
		width: 29%;
		height: 90%;
		/* background-color: blue; */
		display: flex;
		justify-content: space-around;

	}

	.wx {
		width: 140upx;
		height: 38upx;
		/* background-color: aqua; */
		margin-top: 14px;
		margin-left: 57px;
		text-align: center;
		font-size: 34upx;

		color: #999999;

	}

	.wx img {
		width: 100%;
		height: 100%;
	}

	.radio {
		width: 100%;
		height: 98upx;
		/* background-color: aqua; */
		border-bottom: 1px solid #f2f2f2;
		display: flex;

	}

	.radio p {
		margin-left: 20upx;
		line-height: 96upx;
		font-size: 30upx;
		color: #adadad;

	}

	.radio-in {
		width: 80%;
		height: 76%;
		/* background-color: #faab34; */
		margin-left: 20upx;
		margin-top: 22upx;
	}

	.text {
		width: 100%;
		height: 302upx;
		/* background-color: aquamarine; */
		border-bottom: 1px solid #f2f2f2;
	}

	.text input {
		line-height: 30upx;
		margin-top: 20upx;
	}

	.fabu-img {
		width: 200upx;
		height: 200upx;
		/* background-color: #faab34; */
		margin-top: 20upx;
		margin-left: 20upx;
	}

	.fabu-img img {
		width: 100%;
		height: 100%;
	}
</style>
